<%@ page import="com.iot08.admin.resp.VipMemberResp" %>
<%@ page import="java.util.Date" %>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";
%>
<!DOCTYPE html>
<html lang="en">
<head>
    <base href="<%=basePath%>">
    <meta charset="utf-8"/>
    <title>开/插屏广告商</title>
    <meta name="description" content="overview & stats"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <link href="static/css/bootstrap.min.css" rel="stylesheet"/>
    <link href="static/css/bootstrap-responsive.min.css" rel="stylesheet"/>
    <link rel="stylesheet" href="static/css/font-awesome.min.css"/>
    <link rel="stylesheet" href="static/css/ace.min.css"/>
    <link rel="stylesheet" href="static/css/ace-responsive.min.css"/>
    <link rel="stylesheet" href="static/css/ace-skins.min.css"/>
    <script type="text/javascript" src="static/js/jquery-1.7.2.js"></script>
    <!--提示框-->
    <script type="text/javascript" src="static/js/jquery.tips.js"></script>
</head>

<script type="text/javascript">
    $(function () {
        top.hangge();
    });
    //保存
    function save() {
        var type = $("#type").val();
        if (type == "") {
            alert("请选择会员类型");
            return false;
        }
        var isVip = $("#isVip").val();
        if (isVip == "") {
            alert("请选择是否为会员");
            return false;
        }
        if($("#beginTime").val() == ""){
           alert("开始时间不能为空");
           return false;
        }
        if($("#endTime").val() == ""){
            alert("截至时间不能为空");
            return false;
        }
        if($("#beginTime").val() != "" && $("#endTime").val() != "") {
            if(!compareTime($("#beginTime").val(),$("#endTime").val())) {
                alert("开始时间不能大于结束时间");
                return false;
            }
        }
        $("#menuForm").submit();
    }

    function compareTime(startTime, endTime) {
        // 把时间字符串转为 Date 对象
        const start = new Date(startTime.replace(/-/g, '/'));
        const end = new Date(endTime.replace(/-/g, '/'));
        if (start > end) {
            return false;
        } else {
            return true;
        }
    }
</script>

<body>
<form action="vipMember/edit" name="menuForm" id="menuForm" method="post" enctype="multipart/form-data">
    <input type="hidden" id="id" name="id" value="${vipMemberResp.id}">
    <div id="zhongxin" class="zhongxin-cla">
        <%
            // 只能通过 pageContext 获取 JSTL 变量
            Object obj = pageContext.findAttribute("vipMemberResp");
            if (obj != null) {
                VipMemberResp bsi =  (VipMemberResp) obj;
                long startTs = bsi.getBeginTime() * 1000L;
                long endTs = bsi.getEndTime() * 1000L;
                Date startDate = new Date(startTs);
                Date endDate = new Date(endTs);
                pageContext.setAttribute("startTimeDate", startDate);
                pageContext.setAttribute("endTimeDate", endDate);
            }
        %>
        <table>
            <tr>
                <td>
                    <%--<font color='red'>*</font>--%>
                    <span style="margin-top:5px;display: inline-block;">用户电话：</span>
                    <input type="text" name="phone" id="phone" value="${vipMemberResp.phone}" style="margin-top:5px;vertical-align:top;width:200px;" disabled/>
                </td>
            </tr>
            <tr>
                <td>
                    <%-- <font color='red'>*</font>--%>
                    <span style="margin-top:5px;display: inline-block;">会员类型：</span>
                    <select id="type" name="type" data-placeholder="请选择会员类型" style="margin-top:5px;vertical-align:top;">
                        <option value="">选择会员类型</option>
                        <option value="1" <c:if test="${vipMemberResp.type != null && vipMemberResp.type == 1}">selected</c:if>>月会员</option>
                        <option value="2" <c:if test="${vipMemberResp.type != null && vipMemberResp.type == 2}">selected</c:if>>年会员</option>
                        <option value="3" <c:if test="${vipMemberResp.type != null && vipMemberResp.type == 3}">selected</c:if>>永久会员</option>
                        <option value="4" <c:if test="${vipMemberResp.type != null && vipMemberResp.type == 4}">selected</c:if>>半年会员</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>
                    <span style="margin-top:5px;display: inline-block;">是否为会员：</span>
                    <select id="isVip" name="isVip" data-placeholder="请选择是否为会员" style="margin-top:5px;vertical-align:top;">
                        <option value="">选择是否为会员</option>
                        <option value="0" <c:if test="${vipMemberResp.isVip != null && vipMemberResp.isVip == 0}">selected</c:if>>否</option>
                        <option value="1" <c:if test="${vipMemberResp.isVip != null && vipMemberResp.isVip == 1}">selected</c:if>>是</option>
                    </select>
                </td>
            </tr>
            <tr>
                <td>
                    <span style="margin-top:5px;display: inline-block;">开始时间:</span>
                    <input name="beginTime" id="beginTime" type="text" style="margin-top:5px;width:200px;display: table-cell;" value="<fmt:formatDate value='${startTimeDate}' pattern='yyyy-MM-dd HH:mm:ss' />" placeholder="开始时间" title="开始时间"/>
            </tr>
            <tr>
                <td>
                    <span style="margin-top:5px;display: inline-block;">截至时间:</span>
                    <input name="endTime" id="endTime" type="text" style="margin-top:5px;width:200px;display: table-cell;" value="<fmt:formatDate value='${endTimeDate}' pattern='yyyy-MM-dd HH:mm:ss' />" placeholder="结束时间" title="结束时间"/>
                </td>
            </tr>
            <tr>
                <td style="text-align: center; padding-top: 10px;">
                    <a class="btn btn-mini btn-primary" onclick="save();">保存</a>
                    <a class="btn btn-mini btn-danger" onclick="top.Dialog.close();">取消</a>
                </td>
            </tr>
        </table>
    </div>
    <div id="zhongxin2" class="center" style="display:none">
        <br/><br/><br/><img src="static/images/jiazai.gif"/><br/>
        <h4 class="lighter block green"></h4>
    </div>
</form>
<!-- 样式和库文件 -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.4.1/dist/css/bootstrap.min.css"/>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/eonasdan-bootstrap-datetimepicker@4.17.47/build/css/bootstrap-datetimepicker.min.css"/>
<script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/moment@2.29.1/moment.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/moment/locale/zh-cn.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@3.4.1/dist/js/bootstrap.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/eonasdan-bootstrap-datetimepicker@4.17.47/build/js/bootstrap-datetimepicker.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/eonasdan-bootstrap-datetimepicker@4.17.47/src/js/locales/bootstrap-datetimepicker.zh-CN.js"></script>

<script type="text/javascript">
    $('#beginTime').datetimepicker({
        format: 'YYYY-MM-DD HH:mm:ss',
        locale: 'zh-cn'  // 👈 设置为中文
    });
    $('#endTime').datetimepicker({
        format: 'YYYY-MM-DD HH:mm:ss',
        locale: 'zh-cn'  // 👈 设置为中文
    });
</script>
</body>
</html>